<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>大航海时代:起源 大流行事件时间表</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="js/fashion_calendar.js"></script>
    <script src="js/clock.js"></script>

    <style>

        #main_table {
            font-family: Arial, Helvetica, sans-serif;
            border-collapse: collapse;
            width: 100%;
            font-size: 13px;
        }

        #main_table td, #main_table th {
            border: 1px solid #ddd;
            padding: 8px;
        }

        #main_table tr:nth-child(even) {
            background-color: #f2f2f2;
        }

        #main_table tr:hover {
            background-color: #ce9f47;
        }

        #main_table th {
            padding-top: 12px;
            padding-bottom: 12px;
            text-align: left;
            background-color: #585b58;
            color: white;
        }
    </style>
</head>
<body>
<div>
    <div>
        <div style="float:left;width:400px" id="fashion_info">
            <!--        流行详情-->
        </div>
        <div id="head" style="text-align: center">
            <p>大航海时代:起源 大流行事件时间表 <a href="https://gitee.com/wyl219/uwo_calendar">开源项目地址</a></p>
            <p>点击刷新将计算<input type="text" value="5" id="fill_time" style="width: 10px">小时内的流行,点击设置以打开设置页面,设置筛选,设置后点击刷新以应用
                <input type="submit" id="ref_btn" value="刷新" onclick="fill_main_table()">
                <input type="submit" id="set_btn" value="设置" onclick="set_div_hidden()">
            </p>
            <p><a href="http://uwo.kr/trend.jsp">韩文原始网页点这里</a>,由于时差原因,该网页应按照+9时区查看,例如北京时间13点应查看该网页14点的内容.
            </p>
            <p>本网页已调整时差,经测试,与steam版本一致. </p>
            <p>鼠标放在<b>表格内的流行名</b>上可以显示具体流行内容</p>
            <p>当前时间为<b id="now_time"></b>,距离整点大约还需要<b id="sea_day"></b>海洋日.注意,各区域更新流行时间略有不同</p>
            <p>当前港口内时间(UTC)为<b id="town_time"></b>,到下一个6点大约需要<b id="next_6_sea_day"></b>个海洋日,注意游戏内不同港口内时间有<a target="_blank" href="https://docs.google.com/spreadsheets/d/e/2PACX-1vQ4zf-HZrAd9GsDKOZ0-idWpOTpK3CGY7dr2x-rAwu_oT6N_ZOq1d8JxR7eerNCCjnWZEq1ytJfWB7-/pubhtml?gid=724818494&single=true">时差</a>.</p>
        </div>
<!--        <div id="clock" class="clock_con">-->

<!--        </div>-->

    </div>

</div>

<div id="set_div" hidden>

    <!--    设置区域-->
    <div id="hidden_by_zone">
        <br>
        <!--    按区域隐藏-->
    </div>
    <div id="hidden_fashion">
        <label>
            按活动名称筛选<input type="radio" name="fill_fashion" value="by_name" id="fill_fashion_by_name"
                                 onclick="raido_fill_fashion_by_name()" checked>
        </label>
        <label>
            按商品类型筛选<input type="radio" name="fill_fashion" value="by_type" id="fill_fashion_by_type"
                                 onclick="raido_fill_fashion_by_type()">
        </label>
        <!--    隐藏流行活动-->
        <div id="by_name"></div>
        <!--        根据活动名称隐藏-->
        <div id="by_type" hidden></div>
        <!--        根据活动内容隐藏-->
    </div>
</div>
<div id="main_table_div">
</div>

<div id="区域地图" style="text-align: center ;font-size: 15px">
    <br>
    <p>各区域划分图(点击图片跳转到澳服 怪蜀黍的腾讯文档版)</p>
    <a target="_blank"
       href="https://docs.qq.com/sheet/DRXJEQnRna3FhRlNW?ADPUBNO=27268&ADSESSION=1677464067&ADTAG=CLIENT.QQ.5941_.0&ADUIN=372512756&tab=14wmp9&tdsourcetag=s_pcqq_liaotianjilu&ADUIN=304363200&ADSESSION=1677666004&ADTAG=CLIENT.QQ.5687_.0&ADPUBNO=27284&jumpuin=304363200">
        <img alt="加载失败,可以点击并跳转到腾讯文档版查看" src="区域地图.jpeg" height="800"></a>
</div>
</body>
</html>

